<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <input type="text" id="num1">
    <select name="" id="sel">
        <option value="+">+</option>
        <option value="-">-</option>
        <option value="*">*</option>
        <option value="/">/</option>

    </select>
    <input type="text" id="num2">
    <button id="btn">提交</button>
    <input type="text" id="res">
    <script>
        // 获取元素 
        var num1Ele = document.getElementById("num1");
        var num2Ele = document.getElementById("num2")
        var selEle = document.getElementById("sel")
        var btnEle = document.getElementById("btn")
        var resEle = document.getElementById("res")

        console.log(num1Ele)  //元素对象


        btnEle.onclick = function () {
            var num1 = parseInt(num1Ele.value)
            var num2 = parseInt(num2Ele.value)
            var sel = selEle.value
            console.log(num1,num2,sel);
            if (sel == "+") {
                var res = num1 + num2
            } else if (sel == "-") {
                var res = num1 - num2

            } else if (sel == "*") {
                var res = num1 * num2
            } else if (sel == "/") {
                var res = num1 / num2
            }
            resEle.value = res
        }


        // 1.多打印 （一步一步打印） 2.看报错 后面可以点看具体哪一行的
    </script>
</body>

</html>